import React from 'react'

import PropTypes from 'prop-types';

class Counter extends React.Component {
    constructor(props) {
        // console.log('call constructor prop:'+JSON.stringify(props));
        super(props);
    }

    render() {
        const {count, hello, onIncrease, onDecrement, onReset} = this.props;
        console.log('CounterCom this.props'+ JSON.stringify(this.props));
        return (
            <div className="my-button">
                <button onClick={this.props.onIncrease}>Click Me</button>
                <button onClick={this.props.onDecrement}>Say Hello</button>
                <button onClick={this.props.onReset}>Say Hello</button>
                <div>
                    <div>Click Count: {this.props.count}</div>
                    <div>Say: {this.props.hello}</div>
                </div>
            </div>
        )
    }
}

Counter.propTypes = {
    count: PropTypes.number.isRequired,
    hello: PropTypes.string.isRequired,
    onIncrease: PropTypes.func.isRequired,
    onDecrement: PropTypes.func.isRequired,
    onReset: PropTypes.func.isRequired,
};

export default Counter;